<template>
    <view style="height: 100%">
        <view v-if="activityDetail.userStatus == 1">
            <view v-if="activityDetail.status == 2">
                
                <view class="invitation_bg">
                    <image class="invitation_bg_img" src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/invitation/bg2.png"></image>
                    <view class="content">
                        <view class="content_wrap">
                            <view class="content_title">
                                <image src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/invitation/title.png"></image>
                            </view>
                            <view class="content_center">
                                <!-- <view class="content_center_p">
                                    每邀请
                                    <text>1位新用户</text>
                                    完成指定操作
                                    <view class="content_center_p1"></view>
                                </view> -->
                                <!-- <view class="content_center_p" v-if="isShow1">
                                    <text class="user_type_title">可获得</text>
                                    <text v-if="inviteDetail.oldUserReward.oldBonusStr">{{ inviteDetail.oldUserReward.oldBonusStr }}、</text>
                                    <text v-if="inviteDetail.oldUserReward.oldCardStr">{{ inviteDetail.oldUserReward.oldCardStr }}、</text>
                                    <text v-if="inviteDetail.oldUserReward.oldCouponStr">{{ inviteDetail.oldUserReward.oldCouponStr }}、</text>
                                    <text v-if="inviteDetail.oldUserReward.oldEquityStr">{{ inviteDetail.oldUserReward.oldEquityStr }}、</text>
                                    <text v-if="inviteDetail.oldUserReward.oldIntegralStr">{{ inviteDetail.oldUserReward.oldIntegralStr }}</text>
                                </view>
                                <view class="content_center_p" v-if="isShow2">
                                    <text class="user_type_title">好友可获得</text>
                                    <text v-if="inviteDetail.newUserReward.newBonusStr">{{ inviteDetail.newUserReward.newBonusStr }}、</text>
                                    <text v-if="inviteDetail.newUserReward.newCardStr">{{ inviteDetail.newUserReward.newCardStr }}、</text>
                                    <text v-if="inviteDetail.newUserReward.newCouponStr">{{ inviteDetail.newUserReward.newCouponStr }}、</text>
                                    <text v-if="inviteDetail.newUserReward.newEquityStr">{{ inviteDetail.newUserReward.newEquityStr }}、</text>
                                    <text v-if="inviteDetail.newUserReward.newIntegralStr">{{ inviteDetail.newUserReward.newIntegralStr }}</text>
                                </view> -->
                            </view>
                            <view class="content_btn">
                                <view class="content_btn1">
                                    <image
                                        src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/invitation/btn_02.png"
                                        mode="aspectFill"
                                        @tap="openPosterPopupClick"
                                    ></image>
                                </view>
                                <view class="content_btn2">
                                    <button v-if="inviteDetail.applyUserStatus == 1" class="share-button" open-type="share">
                                        <image src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/invitation/btn_01.png" mode="aspectFill"></image>
                                    </button>
                                    <button class="share-button" @tap="showTips" v-else>
                                        <image src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/invitation/btn_01.png" mode="aspectFill"></image>
                                    </button>
                                </view>
                            </view>
                        </view>
                    </view>
                </view>

                <view class="container_bg">
                    <!-- 我的邀请 -->
                    <view class="container_item">
                        <view class="item_tit">
                            <view class="item_tit_fl">
                                <image src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/invitation/line_bg.png" mode="aspectFill"></image>
                                <view class="item_tit_fl_text">我的邀请</view>
                            </view>
                            <!-- v-if="InviteTotal.inviteUserCount!=0" -->
                            <view class="item_tit_fr" @tap="toDetaile" >
                                查看明细
                                <image src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/invitation/turn.png" mode="aspectFill"></image>
                            </view>
                        </view>
                        <view class="item_wrap_box">
                            <view class="item_wrap" v-if="InviteTotal.inviteUserCount!=0">
                                <view class="item_wrap1">累计成功邀请{{ InviteTotal.inviteUserCount || 0 }}人</view>
                                <!-- <view class="item_wrap2">
                                    已获得免服务费{{ InviteTotal.freeServiceFeeCount || 0 }}次、奖励金{{ InviteTotal.bountyAmount || 0 }}元、优惠券{{
                                        InviteTotal.couponAmount || 0
                                    }}元、积分{{ InviteTotal.integral || 0 }}
                                </view> -->
                                <view class="item_wrap2" v-if="InviteTotal.bountyAmount || InviteTotal.integral || InviteTotal.rewardCouponCount || InviteTotal.rewardCardCount || InviteTotal.rewardEquityCount">
                                    已获得
									<template v-if="InviteTotal.bountyAmount">奖励金{{ InviteTotal.bountyAmount || 0 }}元、</template>
									<template v-if="InviteTotal.integral">积分{{ InviteTotal.integral || 0 }}分、</template>
									<template v-if="InviteTotal.rewardCouponCount">优惠券{{ InviteTotal.rewardCouponCount || 0 }}张、</template>
									<template v-if="InviteTotal.rewardCardCount">卡{{ InviteTotal.rewardCardCount || 0 }}张、</template>
									<template v-if="InviteTotal.rewardEquityCount">权益{{ InviteTotal.rewardEquityCount || 0 }}张</template>
                                </view>
                            </view>
							<view class="item_wrap" v-else>
								<view class="item_wrap1">还未加入活动,赶紧来加入吧！</view>
							</view>
                        </view>
                    </view>

                    <!-- 邀请方法 -->
                    <view class="container_item">
                        <view class="item_tit">
                            <view class="item_tit_fl">
                                <image src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/invitation/line_bg.png" mode="aspectFill"></image>
                                <view class="item_tit_fl_text">邀请方法</view>
                            </view>
                        </view>
                        <view class="item_wrap_box2">
                            <view class="item_method">
                                <view class="method_item">
                                    <image
                                        class="item_icon"
                                        src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/invitation/icon_01.png"
                                        mode="aspectFill"
                                    ></image>
                                    <view class="item_des">发送邀请链接或海报给好友</view>
                                </view>
                                <view class="method_item">
                                    <image
                                        class="item_bz"
                                        src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/invitation/dot.png"
                                        mode="aspectFill"
                                    ></image>
                                </view>
                                <view class="method_item">
                                    <image
                                        class="item_icon"
                                        src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/invitation/icon_02.png"
                                        mode="aspectFill"
                                    ></image>
                                    <view class="item_des">好友{{ activityDetail.invitationText }}成功</view>
                                </view>
                                <view class="method_item">
                                    <image
                                        class="item_bz"
                                        src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/invitation/dot.png"
                                        mode="aspectFill"
                                    ></image>
                                </view>
                                <view class="method_item">
                                    <image
                                        class="item_icon"
                                        src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/invitation/icon_03.png"
                                        mode="aspectFill"
                                    ></image>
                                    <view class="item_des">获得奖励</view>
                                </view>
                            </view>

                            <!-- 邀请新用户注册 -->
                            <invitation-item title="邀请新用户注册" :data="registerReward"></invitation-item>
                            <!-- 邀请新用户首次充值 -->
                            <invitation-item title="邀请新用户首次充值" :data="rechargeReward"></invitation-item>
                            <!-- 邀请新用户首次消费 -->
                            <invitation-item title="邀请新用户首次消费" :data="consumeReward"></invitation-item>
                        </view>
                    </view>

                    <!-- 活动规则 -->
                    <view class="container_item">
                        <view class="item_tit">
                            <view class="item_tit_fl">
                                <image src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/invitation/line_bg.png" mode="aspectFill"></image>
                                <view class="item_tit_fl_text">活动规则</view>
                            </view>
                        </view>

                        <view class="cardCoupon_explain">
                            <view class="explain_item">
                                <view class="explain_icon">
                                    <image class="card_xd_icon" src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/invitation/icon_date.png"></image>
                                </view>
                                <view class="explain_title">
                                    <text>活动期限</text>
                                </view>
                                <view class="explain_des">
                                    <text v-if="!activityDetail.endTime">长期有效</text>
                                    <text v-else>{{ activityDetail.startTime }}-{{ activityDetail.endTime }}</text>
                                </view>
                            </view>

                            <view class="explain_item">
                                <view class="explain_icon">
                                    <image class="card_xd_icon" src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/invitation/icon_time.png"></image>
                                </view>
                                <view class="explain_title">
                                    <text>活动时间段</text>
                                </view>
                                <view class="explain_des">
                                    <text>{{ activityDetail.limitTime || '全天' }}</text>
                                </view>
                            </view>

                            <view class="explain_item">
                                <view class="explain_icon">
                                    <image class="card_xd_icon" src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/invitation/icon_user.png"></image>
                                </view>
                                <view class="explain_title">适用用户</view>
                                <view class="explain_des">
                                    <text v-if="activityDetail.applyUserStatus == 1">所有用户</text>
                                    <text v-if="activityDetail.applyUserStatus == 2">所有个人会员</text>
                                    <text v-if="activityDetail.applyUserStatus == 3">指定个人会员</text>
                                    <text v-if="activityDetail.applyUserStatus == 4">所有车队会员</text>
                                    <text v-if="activityDetail.applyUserStatus == 5">指定车队会员</text>
                                </view>
                            </view>
                        </view>
                    </view>

                    <!-- 活动说明 -->
                    <view class="container_item">
                        <view class="item_tit">
                            <view class="item_tit_fl">
                                <image src="http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/invitation/line_bg.png" mode="aspectFill"></image>
                                <view class="item_tit_fl_text">活动说明</view>
                            </view>
                        </view>
                        <view class="item_wrap_box3">
                            <view class="item_wrap">
                                {{ activityDetail.explainText }}
                            </view>
                        </view>
                    </view>
                </view>

       
				
				<invitation-poster ref='poster' :shareConfig="shareConfig" :showPosterPopup="showPosterPopup" @close="closePosterPopup" @open="openPosterPopup" canvasId='canvasId' />

                <!-- <share-tabs tabsShow="{{showPosterPopup}}" shareConfig="{{shareConfig}}" bindtabsclose="closePosterPopup"></share-tabs> -->
            </view>

            <view v-if="activityDetail.status == 1">
                <Upgrading imgType="s1" text="活动开始时间 " :textTime="activityDetail.startTime" text2="敬请期待!"></Upgrading>
            </view>

            <view v-if="activityDetail.status == 3">
                <Upgrading imgType="s3" text="哎呀，活动结束了~"></Upgrading>
            </view>

            <view v-if="activityDetail.status == 4">
                <Upgrading imgType="s3" text="哎呀，活动已停止~"></Upgrading>
            </view>
        </view>

        <view v-if="activityDetail.userStatus == 2">
            <Upgrading imgType="u0" text="抱歉，您不是受邀用户，暂时无法参加此活动哦!"></Upgrading>
        </view>	
    </view>
</template>

<script>   
// import zpMixins from '@/uni_modules/zp-mixins/index';
import invitationPoster from '../../../components/invitation-poster/invitation-poster.vue';
import invitationItem from '../../../components/invitation-item/invitation-item.vue';
import shareTabs from '../../../components/share-tabs/share-tabs.vue';
import Upgrading from '../../../components/upgrading/upgrading.vue';
// marketing/pages/invite/invitation/invitation.ts
import { getInviteDetail, userInviteTotal } from '../../../../api/marketing/invitation';
import shareTypes from '../../../../utils/shareTypes';
export default{
    components: {
        invitationPoster,
        invitationItem,
        shareTabs,
        Upgrading
    },
    data() {
        return {
			isShow1:false,
			isShow2:false,
            applyUserStatus: 2,
            //判断是否适用用户  1适用 2不适用
            inviteDetail: {
                serviceFeeCount: '',
                bonusAmount: '',
                couponAmount: '',
                integral: '',
                inviteServiceFeeCount: '',
                inviteBonusAmount: '',
                inviteCouponAmount: '',
                inviteIntegral: '',
                applyUserStatus: 0
            },
            InviteTotal: {
                inviteUserCount: '',
                freeServiceFeeCount: '',
                bountyAmount: '',
                couponAmount: '',
                integral: ''
            },
            registerReward: {},
            // registerReward 新用户注册
            consumeReward: {},
            // consumeReward 新用户首次消费
            rechargeReward: {},
            // rechargeReward 新用户首次充值
            activityDetail: {
                userStatus: 0,
                status: 0,
                invitationText: '',
                endTime: '',
                startTime: '',
                limitTime: '',
                applyUserStatus: 0,
                explainText: ''
            },
            //活动详情
            activityId: '',
            //活动ID
            shareConfig: {},
            sharePath: '',
            showPosterPopup: false,
            poster: null
        };
    },
    /**
     * 生命周期函数--监听页面加载
     */
    onLoad(options) {
        let id = options.HD;
        this.setData(
            {
                activityId: id
            },
            this.setSharePath
        );
        this.getInviteDetail();
    },
    /**
     * 生命周期函数--监听页面初次渲染完成
     */
    onReady() {},
    /**
     * 生命周期函数--监听页面显示
     */
    onShow() {},
    /**
     * 生命周期函数--监听页面隐藏
     */
    onHide() {},
    /**
     * 生命周期函数--监听页面卸载
     */
    onUnload() {},
    /**
     * 页面相关事件处理函数--监听用户下拉动作
     */
    onPullDownRefresh() {},
    /**
     * 页面上拉触底事件的处理函数
     */
    onReachBottom() {},
    /**
     * 用户点击右上角分享
     */
    onShareAppMessage() {
        return {
            title: `帮我点一下，一起来享受充电优惠吧！`,
            imageUrl: 'http://oos-cn.ctyunapi.cn/front-end/static/marketingImg/marketing/images/invitation/activity.png',
            path: this.sharePath
        };
    },
    methods: {
		openPosterPopupClick(){
			this.$refs.poster.openPosterPopup()
		},
		openPosterPopup(){
			this.showPosterPopup = true
		},
        closePosterPopup(e) {
			this.showPosterPopup = false
        },

        setSharePath() {
            let uid = uni.getStorageSync('memberId');
            let activityId = this.activityId;
            // 截取活动id后面8位，因为生成二维码入参不能超过32位
            let HD = activityId.slice(-8);
            console.log('这是截取的活动id', HD);
            this.setData({
                sharePath: `/pages/sharePage/sharePage?uid=${uid}&ST=${shareTypes.YAOQING}&HD=${HD}`,
                shareConfig: {
                    path: '/pages/sharePage/sharePage',
                    scene: `uid=${uid}&ST=${shareTypes.YAOQING}&HD=${HD}`
                }
            });
        },

        async getInviteDetail() {
            try {
                const res = await getInviteDetail({
                    activityId: this.activityId
                });
                let inviteDetail = res.data || {};
				//邀请人顶部是否显示奖励
				if(inviteDetail.oldUserReward.oldBonusStr||inviteDetail.oldUserReward.oldCardStr||inviteDetail.oldUserReward.oldCouponStr||inviteDetail.oldUserReward.oldEquityStr||inviteDetail.oldUserReward.oldIntegralStr){
					this.isShow1=true
				}else{
					this.isShow1=false
				}
				//受邀人顶部是否显示奖励
				if(inviteDetail.newUserReward.newBonusStr||inviteDetail.newUserReward.newCardStr||inviteDetail.newUserReward.newCouponStr||inviteDetail.newUserReward.newEquityStr||inviteDetail.newUserReward.newIntegralStr){
					this.isShow2=true
				}else{
					this.isShow2=false
				}
                // registerReward 新用户注册
                // consumeReward 新用户首次消费
                // rechargeReward 新用户首次充值
                let { registerReward, consumeReward, rechargeReward, activityDetail } = inviteDetail;
                activityDetail = activityDetail || {};

                // 动态设置邀请文字
                let invitationTextArr = [];
                if (registerReward && registerReward.inviteUser || registerReward && registerReward.user) {
                    invitationTextArr.push('注册');
                }
                if (registerReward && consumeReward.inviteUser || registerReward && consumeReward.user) {
                    invitationTextArr.push('消费');
                }
                if (registerReward && rechargeReward.inviteUser || registerReward && rechargeReward.user) {
                    invitationTextArr.push('充值');
                }
                activityDetail.invitationText = activityDetail ? `${invitationTextArr.join('、')}` : '';

                // 设置邀请新用户注册奖励数据受邀人可得
                if (registerReward && registerReward.inviteUser) {
                    // 奖励免服务费 giveCount
                    registerReward.inviteUser.giveCount = registerReward.inviteUser?.serviceFeeDetail?.giveCount;
                    // 优惠券 couponDetailList
                    registerReward.inviteUser.couponDetailList = registerReward.inviteUser?.couponDetailList || [];
					// 卡 cardDetailList
					registerReward.inviteUser.cardDetailList = registerReward.inviteUser?.cardDetailList|| [];
                    // 奖励金 bonusAmount
                    registerReward.inviteUser.bonusAmount = registerReward.inviteUser?.bonusDetail?.bonusAmount;
                    // 奖励积分 giveIntegral
                    registerReward.inviteUser.giveIntegral = registerReward.inviteUser?.integralDetail?.giveIntegral;
                    // 奖励免服务费 serviceCount
                    registerReward.inviteUser.serviceCount = registerReward.inviteUser?.serviceFeeDetail?.giveCount;
                }
                // 设置邀请新用户注册奖励数据邀请人可得
                if (registerReward && registerReward.user) {
                    registerReward.user.giveCount = registerReward.user?.serviceFeeDetail?.giveCount;
                    registerReward.user.couponDetailList = registerReward.user?.couponDetailList|| [];
					registerReward.user.cardDetailList = registerReward.user?.cardDetailList||[];
                    registerReward.user.bonusAmount = registerReward.user?.bonusDetail?.bonusAmount;
                    registerReward.user.giveIntegral = registerReward.user?.integralDetail?.giveIntegral;
                    registerReward.user.serviceCount = registerReward.user?.serviceFeeDetail?.giveCount;
                }

                // 设置新用户首次消费奖励数据受邀人可得
                if (consumeReward && consumeReward.inviteUser) {
                    consumeReward.inviteUser.giveCount = consumeReward.inviteUser?.serviceFeeDetail?.giveCount;
					consumeReward.inviteUser.couponDetailList = consumeReward.inviteUser?.couponDetailList || [];
					consumeReward.inviteUser.cardDetailList = consumeReward.inviteUser?.cardDetailList ||[];
                    consumeReward.inviteUser.bonusAmount = consumeReward.inviteUser?.bonusDetail?.bonusAmount;
                    consumeReward.inviteUser.giveIntegral = consumeReward.inviteUser?.integralDetail?.giveIntegral;
                    consumeReward.inviteUser.serviceCount = consumeReward.inviteUser?.serviceFeeDetail?.giveCount;
                }
                // 设置新用户首次消费奖励数据邀请人可得
                if (consumeReward && consumeReward.user) {
                    consumeReward.user.giveCount = consumeReward.user?.serviceFeeDetail?.giveCount;
					consumeReward.user.couponDetailList = consumeReward.user?.couponDetailList || [];
					consumeReward.user.cardDetailList = consumeReward.user?.cardDetailList||[];
                    consumeReward.user.bonusAmount = consumeReward.user?.bonusDetail?.bonusAmount;
                    consumeReward.user.giveIntegral = consumeReward.user?.integralDetail?.giveIntegral;
                    consumeReward.user.serviceCount = consumeReward.user?.serviceFeeDetail?.giveCount;
                }

                // 设置新用户首次充值奖励数据受邀人可得
                if (rechargeReward && rechargeReward.inviteUser) {
                    rechargeReward.inviteUser.giveCount = rechargeReward.inviteUser?.serviceFeeDetail?.giveCount;
                    rechargeReward.inviteUser.couponDetailList = rechargeReward.inviteUser?.couponDetailList|| [];
                    rechargeReward.inviteUser.cardDetailList = rechargeReward.inviteUser?.cardDetailList||[];
                    rechargeReward.inviteUser.bonusAmount = rechargeReward.inviteUser?.bonusDetail?.bonusAmount;
                    rechargeReward.inviteUser.giveIntegral = rechargeReward.inviteUser?.integralDetail?.giveIntegral;
                    rechargeReward.inviteUser.serviceCount = rechargeReward.inviteUser?.serviceFeeDetail?.giveCount;
                }

                // 设置新用户首次充值奖励数据邀请人可得
                if (rechargeReward && rechargeReward.user) {
                    rechargeReward.user.giveCount = rechargeReward.user?.serviceFeeDetail?.giveCount;
                    rechargeReward.user.couponDetailList = rechargeReward.user?.couponDetailList || [];
                    rechargeReward.user.cardDetailList = rechargeReward.user?.cardDetailList||[];
                    rechargeReward.user.bonusAmount = rechargeReward.user?.bonusDetail?.bonusAmount;
                    rechargeReward.user.giveIntegral = rechargeReward.user?.integralDetail?.giveIntegral;
                    rechargeReward.user.serviceCount = rechargeReward.user?.serviceFeeDetail?.giveCount;
                }

                // 获取总计
                this.userInviteTotal(activityDetail.number);
                this.setData({
                    inviteDetail,
                    registerReward,
                    consumeReward,
                    rechargeReward,
                    activityDetail
                });
                console.log(res);
            } catch (error) {}
        },

        async userInviteTotal(activityNumber) {
            try {
                const res = await userInviteTotal({
                    userId: uni.getStorageSync('memberId'),
                    activityNumber
                });
                this.setData({
                    InviteTotal: res.data
                });
                console.log(res, '这是总计');
            } catch (error) {}
        },

        toDetaile() {
            uni.navigateTo({
                url: '../invite_detail/invite_detail?activityNumber=' + this.activityDetail.number
            });
        },

        showTips() {
            uni.showToast({
                title: '抱歉你非本活动适用用户，无法参与。',
                icon: 'none'
            });
        }
    }
};
</script>
<style lang="less">
@import url("./invitation.less");
</style>
